<template>
  <div>
    <!-- Form -->

    <el-form :model="form">
      <el-form-item label="账号" :label-width="formLabelWidth">
        <el-input v-model="user.username" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="密码" :label-width="formLabelWidth">
        <el-input
          v-model="user.password"
          autocomplete="off"
          :show-password="true"
        ></el-input>
      </el-form-item>

      <el-form-item label="生日" :label-width="formLabelWidth">
        <el-date-picker
          v-model="user.birthday"
          type="date"
          placeholder="选择日期"
        >
        </el-date-picker>
      </el-form-item>

      <el-form-item label="性别" :label-width="formLabelWidth">
        <el-radio v-model="user.gender" label="1">男</el-radio>
        <el-radio v-model="user.gender" label="0">女</el-radio>
      </el-form-item>

      <el-form-item label="地址" :label-width="formLabelWidth">
        <el-input v-model="user.address" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="电话" :label-width="formLabelWidth">
        <el-input v-model="user.phone" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="邮箱" :label-width="formLabelWidth">
        <el-input v-model="user.email" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button
        @click="
          () => {
            dialogFormVisible = false;
            $emit('close');
          }
        "
        >取 消</el-button
      >

      <el-button type="primary" @click="submit()">注册</el-button>
    </div>
  </div>
</template>

<script>
import { register } from "../api/index";
export default {
  name: "Register",
  data() {
    return {
      // 已登陆
      form: {
        name: "",
        region: "",
        date1: "",
        date2: "",
        delivery: false,
        type: [],
        resource: "",
        desc: "",
      },
      user: {
        username: "",
        password: "",
        birthday: "",
        gender: 1,
        address: "",
        phone: "",
        email: ""

      },
      formLabelWidth: "120px",
    };
  },
  methods: {
    submit() {
      register(
            this.user.username,
            this.user.password,
            this.user.birthday,
            this.user.gender,
            this.user.address,
            this.user.phone,
            this.user.email,
        ).then((res) => {
        let type = res.code === 1 ? "success" : "error";
        this.$message({ message: res.msg, type: type });
        if (res.code === 1) {
          window.localStorage.setItem("userInfo", JSON.stringify(this.user));
          this.$emit("success");
        }
      });
      // this.$message({message: '登陆成功', type: 'success'})
    },
  },
  mounted() {
    //   this.dialogFormVisible = this.open;
  },

  props: {
    open: Boolean,
  },
};
</script>

<style scoped>
</style>
